<template>
  <el-dialog 
  v-model="dialogFormVisible" 
  title="添加员工信息" 
  top="30px"
  :close-on-click-modal="false"
  width="450px">
  <div class="form-style">
        <el-form ref="addForm" :model="form">
            <el-form-item label="名称" prop="name"  style="width: 300px;">
                <el-input v-model="form.name" />
            </el-form-item> 
            <el-form-item label="账号" prop="account" style="width: 300px;">
                <el-input v-model="form.account" />
            </el-form-item>
            <el-form-item label="密码" prop="password" style="width: 300px;">
                <el-input v-model="form.password" type="password"/>
            </el-form-item>
            <el-form-item label="职位" prop="position">
                <el-select v-model="form.position" placeholder="选择职位">
                <el-option value="物资管理" />
                <el-option value="通知管理" />
                <el-option value="报备人员关管理" />
                <el-option value="社区人员关管理" />
                <el-option value="员工管理员" />
                </el-select>
            </el-form-item>
            <el-form-item label="权限" prop="authority">
                <el-select v-model="form.authority" >
                <el-option value="普通员工" />
                <el-option value="管理员" />
                </el-select>
            </el-form-item>
        </el-form>
    </div>  
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="clear"> 清空</el-button>
        <el-button type="primary" @click="submitAddInfo">添加</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script>

    export default {
        data() {
        return {
            dialogFormVisible: false,
            form: {
                name: '',
                account: '',
                password: '',
                position: '',
                authority: '普通员工',
                
            }
        };
        },
        methods: {
            //显示对话框
            dialogShow(){
                this.dialogFormVisible=true;
            },
         
            //提交添加信息
            submitAddInfo(){
				var that=this;
				let params = {
                name:this.form.name,
                account:this.form.account,
                password:this.form.password,
                position:this.form.position,
                authority:this.form.authority
				};
				this.axios
				.post("/staff/add", params)
				.then(function () {
					that.$emit("updateData");
                    that.clear();
					that.dialogFormVisible=false;
				})
				.catch(function (error) {
                    console.log(error);
				});

            },
            //清空表单
            clear(){
				this.$refs['addForm'].resetFields();
            },

        }
    };
</script>
<style scoped>
.form-style{
    margin-left: 40px;
}
</style>
